<!--  -->
<template>
  <div>
    <van-nav-bar title="修改昵称" right-text="保存" @click-right="onClickRight">
      <template #left>
        <i class="iconfont iconbtn_nav_back left" @click="toBack"></i>
      </template>
    </van-nav-bar>

    <van-field v-model="value" placeholder="请输入昵称" />
  </div>
</template>

<script>
export default {
  data () {
    return {
      value: ''
    }
  },
  methods: {
    toBack () {
      this.$router.back()
    },
    // 点击保存
    onClickRight () {}
  }
}
</script>

<style lang="less" scoped>
.van-nav-bar {
  .left {
    position: absolute;
    left: 0;
    padding-left: 0;
    font-size: 50px;
  }
}
::v-deep .van-nav-bar__text {
  color: #000000;
}
.van-field {
  background-color: #f7f4f5;
  width: 368px;
  border-radius: 10px;
  margin: 20px auto;
  height: 40px;
  font-size: 16px;
  align-items: center;
}
</style>
